<template>

    <!-- 这里已组件标签最为最外层元素，可以利用 $attrs $listeners 默认绑定最外层元素的特性 -->
    <Select v-model="valueProxy" v-bind="$attrs" >
        <Option v-for="item of options"
        v-bind='item["_props"]'
        :value="item[valueKey]" 
        :key="item[valueKey]">
        {{ item[labelKey] }}
        </Option>
    </Select>
</template>

<script>
export default {
    model:{
        event:'change'
    },
    props:{
        
        // 数据
        value: {
            default: ''
        },
        // 选项配置
        options:{
            default(){return []}
        },
        // 值取值属性名
        valueKey: {
            default: 'value'
        },
        // 名称取值属性
        labelKey:{
            default: 'label'
        },
        
    },

    computed:{
        // v-modle 代理
        valueProxy:{
            get(){return this.value},
            set(data){this.$emit('change', data)}
        }
    }
    

}
</script>